/*
 *                        佛光普照
 *                        _oo0oo_
 *                       o8888888o
 *                       88" . "88
 *                       (| -_- |)
 *                       0\  =  /0
 *                     ___/`---'\___
 *                   .' \\|     |// '.
 *                  / \\|||  :  |||// \
 *                 / _||||| -:- |||||- \
 *                |   | \\\  - /// |   |
 *                | \_|  ''\---/''  |_/ |
 *                \  .-\__  '-'  ___/-. /
 *              ___'. .'  /--.--\  `. .'___
 *           ."" '<  `.___\_<|>_/___.' >' "".
 *          | | :  `- \`.;`\ _ /`;.`/ - ` : | |
 *          \  \ `_.   \_ __\ /__ _/   .-` /  /
 *      =====`-.____`.___ \_____/___.-`___.-'=====
 *                        `=---='
 *
 *                   李娟祭天 佛法无边
 *      ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 *            佛祖保佑       永不宕机     永无BUG
 *
 *        佛曰:
 *              写字楼里写字间，写字间里程序员；
 *              程序人员写程序，又拿程序换酒钱。
 *              酒醒只在网上坐，酒醉还来网下眠；
 *              酒醉酒醒日复日，网上网下年复年。
 *              但愿老死电脑间，不愿鞠躬老板前；
 *              奔驰宝马贵者趣，公交自行程序员。
 *              别人笑我忒疯癫，我笑自己命太贱；
 *              不见满街漂亮妹，哪个归得程序员？
 */

import React from 'react';
import { Card, Modal, Table } from 'antd';
import { connect } from 'dva';
import router from 'umi/router';
import { PageHeaderWrapper } from '@ant-design/pro-layout';
import ProjectsPath from '@/components/ProjectsPath';
import PageEmpty from '@/components/PageEmpty';
import { utils, BaseTable } from '@/components/BaseTable';
import _ from 'lodash';
import CurrentStage from '../../components/CurrentStage';
import OperationArea from './components/OperationArea';
import { coreIndicatorsColumns } from './utils/treeUtils';
import styles from './index.less';

const mapDispatchToProps = dispatch => {
  const requestData = versionId => {
    dispatch({
      type: 'GROUP_APPROVE_VERSION/getData',
      payload: {
        params: {
          versionId,
        },
      },
    });
  };
  return {
    requestVersionList: props => {
      const { level1, level2, project, version } = props.match.params;
      dispatch({
        type: 'GROUP_APPROVE_VERSION/getVersionList',
        payload: {
          params: {
            projectId: project,
          },
        },
        callback: versionObj => {
          if (version) {
            router.replace(props.match.url);
            requestData(version);
          } else {
            router.replace(
              `/ValueManage/PriceManage/GroupApproveVersion/${level1}/${level2}/${project}/${versionObj.versionId}`,
            );
            requestData(versionObj.versionId);
          }
        },
      });
    },
    onChangeVersion: (versionId, props) => {
      const { level1, level2, project } = props.match.params;
      router.replace(
        `/ValueManage/PriceManage/GroupApproveVersion/${level1}/${level2}/${project}/${versionId}`,
      );
      requestData(versionId);
    },
    onClickCoreIndicators: () => {
      dispatch({ type: 'GROUP_APPROVE_VERSION/handlerCoreIndicatorsVisible' });
    },
  };
};
@connect(
  state => ({
    orgStructure: state.orgStructure,
    modelState: state.GROUP_APPROVE_VERSION,
  }),
  mapDispatchToProps,
)
class IndexPage extends React.PureComponent {
  state = {};

  componentDidMount() {
    this.props.requestVersionList(this.props);
  }

  componentWillReceiveProps(nextProps) {
    if (this.props.match.params.project !== nextProps.match.params.project) {
      this.props.requestVersionList(nextProps);
    }
  }

  render() {
    const {
      emptyTitle,
      dataSource,
      versionList,
      expandedRowKeys,
      titleTree,
      fixedColumns,
      versionLoading,
      coreIndicatorsVisible,
      coreIndicatorsData,
      coreIndicatorsLoading,
    } = this.props.modelState;
    const currentVersion = _.filter(
      versionList,
      x => x.versionId === this.props.match.params.version,
    );
    return (
      <PageHeaderWrapper
        className="page-header"
        breadcrumb={null}
        title={<ProjectsPath {...this.props} />}
        tags={<CurrentStage {...this.props} />}
      >
        <Modal
          className={styles['core-indicators-modal']}
          width={800}
          title="核心指标详情"
          centered
          destroyOnClose
          visible={coreIndicatorsVisible}
          onCancel={this.props.onClickCoreIndicators}
          footer={null}
        >
          <Table
            size="small"
            columns={coreIndicatorsColumns}
            bordered
            dataSource={coreIndicatorsData}
            loading={coreIndicatorsLoading}
            pagination={false}
            tableLayout="fixed"
          />
        </Modal>
        <Card className="page-header-card">
          {Boolean(versionList.length) && (
            <OperationArea
              coreIndicatorsDisabled={!dataSource.length}
              versionLoading={versionLoading}
              currentVersion={_.head(currentVersion)}
              versionList={versionList}
              onChangeVersion={versionId => this.props.onChangeVersion(versionId, this.props)}
              onClickCoreIndicators={this.props.onClickCoreIndicators}
            />
          )}
          {dataSource?.length ? (
            <BaseTable
              subtractHeight="160px"
              headerHeight={[30, 30, 60]}
              headerRenderer={utils.getHeaderRenderer(titleTree, 2)}
              defaultExpandedRowKeys={expandedRowKeys}
              expandColumnKey="name"
              fixedColumns={fixedColumns}
              treeData={dataSource}
            />
          ) : (
            <PageEmpty emptyTitle={emptyTitle} />
          )}
        </Card>
      </PageHeaderWrapper>
    );
  }
}

export default IndexPage;
